<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Scabish.cn</title>
	<link rel="stylesheet" type="text/css" href="<?php echo __PUBLIC__?>/style/index.css">
	<script src="<?php echo __PUBLIC__?>/js/jquery.js" type="text/javascript"></script>
</head>

<body class="page page-parent">
<div id="wrap">
	<div id="header">
		<a class="logo" href="http://www.phonegap.com" name="PhoneGap"></a>
		<div id="menu">
			<form class="mobile-show">
				<select onchange="location = this.options[this.selectedIndex].value;">
					<option value="/" selected="selected" class="selected">Home</option>

					<option value="/about">About</option>
					<option value="/contributors">Contributors</option>
					<option value="/support">Support</option>
					<option value="/contact">Contact</option>
					<optgroup label="Developers">
						<option value="http://docs.phonegap.com">API Doc</option>
						<option value="/start">Getting Started Guide</option>
						<option value="http://wiki.phonegap.com">Wiki</option>
						<option value="/about/features">Supported Features</option>
					</optgroup>
					<optgroup label="Community">
						<option value="/apps">Apps</option>
						<option value="/tools">Tools</option>

						<option value="http://groups.google.com/group/phonegap">Google Groups</option>
						<option value="http://phonegap.meetup.com">Meetup Groups</option>
						<option value="/community#irc">IRC</option>
					</optgroup>
				</select>
			</form>

		<div class="mobile-hide" >

			<a class="menu-item-about" href="/about">About<span class="arrow-down"></span></a>
			<a class="menu-item-dev" href="/docs">Developers<span class="arrow-down"></span></a>
			<a class="menu-item-community" href="/community">Community<span class="arrow-down"></span></a>
			<a class="menu-item-support" href="/support">Support<span class="arrow-down"></span></a>
		</div>

		<div style="left: -8px; height: 0px; display: block;" class="dropdown dropdown-about">

			<ul>
				<li><a href="/about">Overview</a></li>
				<li><a href="/about/features">Supported<br>Features</a></li>
				<li><a href="/about/license">License</a></li>
				<li><a href="/contributors">Contributors</a></li>
				<li><a href="/about/story">Story</a></li>

			</ul>
		</div>
		
		<div style="left: 216px; height: 0px; display: block;" class="dropdown dropdown-community">
			<ul>
				<li><a href="/apps">Apps</a></li>
				<!-- <li><a href="/plugins">Plugins</a></li> -->
				<li><a href="/community/events">Events</a></li>
				<li><a href="http://phonegap.pbwiki.com/">Wiki<span class="ext">ext</span></a></li>

				<li><a href="http://groups.google.com/group/phonegap">Google Groups<span class="ext">ext</span></a></li>
				<li><a href="http://phonegap.meetup.com">Meetup Groups<span class="ext">ext</span></a></li>
				<li><a href="/blog">Blogs</a></li>
				<li><a href="/community#irc">IRC</a></li>
			</ul>
		</div>

		
		<div class="dropdown dropdown-dev">
			<ul>
				<li><a href="/start">Getting Started</a></li>
				<li><a href="http://docs.phonegap.com/">API Docs</a></li>
				<li><a href="/tools">Development<br>Tools</a></li>
				<li><a href="http://phonegap.pbwiki.com/">Wiki</a></li>

			</ul>
		</div>
		
		<div style="left: 344px; height: 0px; display: block;" class="dropdown dropdown-support">
			<ul>
				<li><a href="/support">Overview</a></li>
				<li><a href="/support#support-packages">Support<br>Packages</a></li>
			</ul>

		</div>
	</div>
	
</div>	
<script type="text/javascript">

function activateDropDown(target, height) {
	var animate = true;
	var prefix = '.dropdown-' + target;
	var menu = $(prefix);
	var height = 25;
	height += $(prefix + ' ul li').length*28;
	height += $(prefix + ' ul li br').length*15;
	
	$(prefix +', ' + '.menu-item-' + target).hover(function(r){
		var item = $(this);
		if (item[0].className && item[0].className.indexOf('menu') > -1) {
			var left = item.position().left-8;
			menu.css('left', left+'px');
			menu.clearQueue().animate({height:height+'px'}, 200);
		}
		animate = false;
		setTimeout(function(){animate = true;},1);
		menu.css('display', 'block');
	}, function(r) {
		setTimeout(function(){if (animate) menu.animate({height:'0px'}, 200);}, 0);
	});
}
activateDropDown('dev');
activateDropDown('community');
activateDropDown('about');
activateDropDown('support');

</script>